<template>

      <el-col :span="24" class="colmargin">
       <el-col :span="6">
             <el-radio-group v-model="indextab" @change="getExecutionList" style="margin-bottom: 10px;">
    <el-radio-button size="small" label="0">费用汇总</el-radio-button>

    <!-- <el-radio-button size="small" label="2">单项已退费</el-radio-button> -->
 
  </el-radio-group>
       </el-col>
     <el-col :span="6">
   <div class="block">
   
    <el-date-picker
      v-model="value1"
      type="daterange"
      range-separator="至"
      start-placeholder="开始日期"
      end-placeholder="结束日期"
      @change="inputch"
       format="yyyy 年 MM 月 dd 日"
      value-format="yyyy-MM-dd"
      >
    </el-date-picker>
  </div>
    </el-col>
   <el-col :span="6">
    <el-input placeholder="搜索" v-model="keyword" @input="inputch"></el-input>
    </el-col>
     <el-col :span="4" style="margin-left:5px;font-size:25px">
    
   总金额 ：{{money}}
    </el-col>
  
         <el-col :span="24">
          <el-table
      :data="tableData"
       ref="multipleTable"
      style="width: 100%"
   
      >

      <!-- <el-table-column
        prop="created_at"
        label="日期"
        width="200"
       >
      </el-table-column>
     -->
      <el-table-column
        prop="cate_name"
        label="费用种类">
      </el-table-column>
        <el-table-column
        prop="name"
        label="项目名称"
       >
      </el-table-column>
        <el-table-column
        prop="number"
        label="数量"
       >
      </el-table-column>
      <el-table-column
        prop="price"
        label="单价">
      </el-table-column>
      <el-table-column
        prop="money"
        label="总价">
      </el-table-column>
   
    </el-table>
      
     <!-- <el-pagination
  background
  small
  layout="prev, pager, next"
  :current-page='currentPage'
  :page-size='pageSize'
  :total="totalPage"
  @prev-click='prevPage'
    @next-click='nextPage'
    @current-change='sizeChange'
    
  >
</el-pagination> -->
      </el-col>
         <!-- <el-col :span="24"  v-if="indextab=='3'&&currentPageData.length!=0" style="margin-bottom: 10px;">
       总价： {{money}} 
         </el-col> -->
        <!-- <el-col :span="24" v-else>
                <el-table
      :data="currentPageData"
      style="width: 100%">
      <el-table-column
        prop="created_at"
        label="日期"
       >
      </el-table-column>
      <el-table-column
        prop="action_type"
        label="费用类型"
       >
        <template slot-scope="scope">
    
         {{scope.row.action_type==1?'充值':scope.row.action_type==2?'退款':'住院结算'}}
      </template>
        
      </el-table-column>
      <el-table-column
        prop="fee"
        label="费用">
      </el-table-column>
      
    </el-table>
      
     <el-pagination
  background
  small
  layout="prev, pager, next"
  :current-page='currentPage'
  :page-size='pageSize'
  :total="totalPage"
  @prev-click='prevPage'
    @next-click='nextPage'
     v-if="currentPageData.length!=0"
  >
</el-pagination>
           </el-col> -->

<el-dialog :close-on-click-modal='false'
  title="提示"
  :visible.sync="centerDialogVisible"
  width="70%"
  center
  class="see_box"
  >

  <span slot="footer" class="dialog-footer">
  
    <el-button type="success" @click="centerDialogVisible = false">确 定</el-button>
  </span>
</el-dialog>

      </el-col>

</template>

<script>
import {
  costRecord,
  deposiLog,
  hospFeeDtlUp,
  hospFeeDtCl,
  refundFee,
  categoryIndex,
  getFeeDetailByHospitalId,
   costGroupRecord,
  backRefundFee
} from "@/api/zhuyanre";

export default {
  name:"costsRecord",
    props: ["id",'uid'],
  data(){
    return {
      tableData:[
     
      ],
      indextab:'0',
      money:'',
      centerDialogVisible:false,
      item:{},
 //所有数据
              totalPage: 1, // 统共页数，默认为1
             currentPage: 1, //当前页数 ，默认为1
            pageSize: 10, // 每页显示数量
            currentPageData: [], //当前页显示内容
    cuntent:[],
    keyword:'',
    rightRadio:'',
    feelist:[],
    value1:['',''],
    }
    
  },
   mounted(){
       
      this.getExecutionList()
    this.categoryIndex()
   },
   watch:{
      id(no){
          this.getExecutionList()
      }
   },
   methods:{
     categoryIndex(){
          categoryIndex({keyword:'',status:''}).then(res=>{
                this.feelist=res.data
          })
     },
     ketui(row){
          if (row.number>row.ketui_num) {
            row.number=row.ketui_num
          }else if (row.number<1) {
            row.number=1
          }
     },
     //查看  详情
     seedelit(item){
       console.log(item)
       this.item=item
       this.centerDialogVisible=true
     },
     inputch(){
        this.getExecutionList()
     },
        getExecutionList() {
          var   time=''
          console.log(this.value1)
          if (this.value1) {
             time=this.value1[0]+'|'+this.value1[1]
           
          }else{
            time=''
          }
         let data = {
        hospital_id:this.id,
         refund_type:this.indextab,
        keyword:this.keyword,
        times: time=='|'?'':time,
        limit:this.pageSize,
        page:this.currentPage
      };
        
       costGroupRecord(data).then(res=>{
                console.log(res)
                     this.tableData=res.data.lists
           this.money=res.data.total
          //  this.item=this.tableData[0]
           this.totalPage=res.data.count
          //  this.totalPage = this.totalPage == 0 ? 1 : this.totalPage;
          //  let begin = (this.currentPage - 1) * this.pageSize;
          //       let end = this.currentPage * this.pageSize;
          //       this.currentPageData = this.tableData.slice(
          //       begin,
          //       end
          //       );
          })
           
    
   

    },
        setCurrentPageData() {
                  let begin = (this.currentPage - 1) * this.pageSize;
                let end = this.currentPage * this.pageSize;
                this.currentPageData = this.tableData.slice(
                begin,
                end
                );
        },
//上一页
prevPage() {
        console.log(this.currentPage);
        if (this.currentPage == 1) return;

        this.currentPage--;
        this.getExecutionList();

},
// 下一页
nextPage() {
        if (this.currentPage == this.totalPage)return ;

        this.currentPage++;
        this.getExecutionList();

        },
        sizeChange(val){
          console.log(val)
          this.currentPage=val
           this.getExecutionList();
        },
        handleSelectionChange(val){
       
          this.cuntent=val
          console.log(this.cuntent)
        },
        chuyuanHospital(){
      
          var arr={
            detail:[],
            hospital_id:this.id,
            member_id:this.uid
          }
          this.cuntent.forEach(res=>{
            arr.detail.push({
             id:res.id,
             number:parseInt(res.ketui_num)
            })
          })
          // arr=arr.toString()
         refundFee(arr).then(res=>{
           if (res.code==200) {
                this.getExecutionList()
               this.$message({
                  message: "提交成功",
                  type: "success"
                });
             this.cuntent=[]    
           }
         
         })
        },
        tuifeiHospital2(row){
             this.$refs.multipleTable.clearSelection();
            this.cuntent.push(row)
            this.chuyuanHospital()
        },
        chuyuanHospital2(id){
            backRefundFee({id:id}).then(res=>{
                       if (res.code==200) {
                this.getExecutionList()
               this.$message({
                  message: "提交成功",
                  type: "success"
                });
           }
            })
        },
        updataquan(){
          
            hospFeeDtlUp({id:this.id,fee_ids:'',is_all:1}).then(res=>{
               if (res.code==200) {
                 this.$message({
                  message: "上传成功",
                  type: "success"
                });
               }
               
            })
        },
        dedataquan(){
              hospFeeDtCl({id:this.id,fee_ids:'',is_all:1}).then(res=>{
              if (res.code==200) {
                 this.$message({
                  message: "撤销成功",
                  type: "success"
                });
               }
            })
        }
 }

 
 
}
</script>

<style scoped>
.colmargin{
  overflow: auto ;
    padding: 0 10px;
} 
.see_box .el-col{
  margin:5px 0px;
  font-size: 20px;
}
.see_box .span{
  color: dimgray;
  font-size: 18px;
  text-indent:2em;
}
 .span{
  color: dimgray;
  font-size: 13px;
  text-indent:2em;
}
.colmargin .el-col{
  margin:2px 0px;
}
</style>